<template>
  <div class="main-container">
    <div class="main-header">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>学习状况报表</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="wrap">
      <div class="content">
        <div class="search-container">
          <el-tabs v-model="type" type="card">
            <el-tab-pane label="学员总时长统计" name="1">
              <report-personal></report-personal>
            </el-tab-pane>
            <el-tab-pane label="学员每天学习统计" name="2">
              <report-personalDateTimesReport></report-personalDateTimesReport>
            </el-tab-pane>
            <el-tab-pane label="学员学习详情" name="3">
              <report-personalTimes></report-personalTimes>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    components: {
      'report-personalDateTimesReport': () => import('./components/personalDateTimesReport'),
      'report-personal': () => import('./components/personalReport'),
      'report-personalTimes': () => import('./components/personalTimesReport'),
    },
    data () {
      return {
        type: '1',
      }
    },
    methods: {
      
    }
  }
</script>
